<template>
  <el-aside :width="collapse ? '64px':'256px'">
    <el-menu
      menu-trigger="click"
      text-color="rgba(255,255,255,0.65)"
      :collapse="collapse"
      :collapse-transition="false"
      :default-active="menusKey"
      router
      style="border-right: 0px"
    >
      <app-menu-item :menus="menus" />
    </el-menu>
  </el-aside>
</template>

<script setup>
import { storeToRefs } from 'pinia'
import { useMenusStore } from '@stores'
import AppMenuItem from './AppMenuItem.vue'
import { propTypes } from '@/utils/propTypes'

const props = defineProps({
  data: propTypes.array
})
const menusStore = useMenusStore()
const { collapse, menus } = storeToRefs(menusStore)
const menusKey = location.hash.slice(1)
</script>

<style lang="scss" scoped>
</style>